import React from 'react'
import { NavBar, Space, Toast } from 'antd-mobile'
import { CapsuleTabs } from 'antd-mobile'
function Index() {
    const list = [
        {
            time: '12:15-10:27',
            didian: '上海站-北京丰台站',
            price: '￥152.5'
        },
        {
            time: '12:15-10:27',
            didian: '上海站-北京丰台站',
            price: '￥152.5'
        },
        {
            time: '12:15-10:27',
            didian: '上海站-北京丰台站',
            price: '￥152.5'
        },
        {
            time: '12:15-10:27',
            didian: '上海站-北京丰台站',
            price: '￥152.5'
        },
        {
            time: '12:15-10:27',
            didian: '上海站-北京丰台站',
            price: '￥152.5'
        },
        {
            time: '12:15-10:27',
            didian: '上海站-北京丰台站',
            price: '￥152.5'
        },
        {
            time: '12:15-10:27',
            didian: '上海站-北京丰台站',
            price: '￥152.5'
        },
        {
            time: '12:15-10:27',
            didian: '上海站-北京丰台站',
            price: '￥152.5'
        },
    ]
    return (
        <div>
            <NavBar>上海-北京</NavBar>
            <CapsuleTabs>
                <CapsuleTabs.Tab title='火车' key='fruits'>
                    {list.map((v, i) => {
                        return <div key={i}>
                            <h3>{v.time}</h3>
                            <h4>{v.didian}</h4>
                            <p>{v.price}</p>
                        </div>


                    })}
                    <div>
                        <h3>12:15-10:27</h3>
                        <h4>上海站-北京丰台站</h4>
                        <p>￥152.5</p>
                    </div>

                </CapsuleTabs.Tab>
                <CapsuleTabs.Tab title='中转' key='vegetables'>

                </CapsuleTabs.Tab>

            </CapsuleTabs>
        </div>
    )
}

export default React.memo(Index)